{% extends 'cm/base.html' %}
{% load static %}
{% block extra_css %}
  <!-- Datatables -->
  <link href="{% static '/vendors/datatables.net-bs/css/dataTables.bootstrap.min.css' %}" rel="stylesheet">
  <link href="{% static '/vendors/datatables.net-buttons-bs/css/buttons.bootstrap.min.css' %}" rel="stylesheet">
  <link href="{% static '/vendors/datatables.net-fixedheader-bs/css/fixedHeader.bootstrap.min.css' %}" rel="stylesheet">
  <link href="{% static '/vendors/datatables.net-responsive-bs/css/responsive.bootstrap.min.css' %}" rel="stylesheet">
  <link href="{% static '/vendors/datatables.net-scroller-bs/css/scroller.bootstrap.min.css' %}" rel="stylesheet">
{% endblock %}

{% block content %}
<div class="x_panel">
  <div class="x_title">
    <h2>Form Basic Elements <small>{{ team.name }}</small></h2>
    <ul class="nav navbar-right panel_toolbox">
      <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
      </li>
      </li>
    </ul>
    <div class="clearfix"></div>
  </div>
  <div class="x_content">
    <br />
    <form class="form-horizontal form-label-left">
      {% csrf_token %}
      {{ form.as_p }}
      <div class="form-group">
        <label class="control-label col-md-3 col-sm-3 col-xs-12">Default Input</label>
        <div class="col-md-9 col-sm-9 col-xs-12">
          <input type="text" class="form-control" placeholder="Default Input" value="{{ object.team_name }}">
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-md-3 col-sm-3 col-xs-12">Disabled Input </label>
        <div class="col-md-9 col-sm-9 col-xs-12">
          <input type="text" class="form-control" disabled="disabled" placeholder="Disabled Input">
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-md-3 col-sm-3 col-xs-12">Read-Only Input</label>
        <div class="col-md-9 col-sm-9 col-xs-12">
          <input type="text" class="form-control" readonly="readonly" placeholder="Read-Only Input">
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-md-3 col-sm-3 col-xs-12">AutoComplete</label>
        <div class="col-md-9 col-sm-9 col-xs-12">
          <input type="text" name="country" id="autocomplete-custom-append" class="form-control col-md-10"/>
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-md-3 col-sm-3 col-xs-12">Select</label>
        <div class="col-md-9 col-sm-9 col-xs-12">
          <select class="form-control">
            <option>Choose option</option>
            <option>Option one</option>
            <option>Option two</option>
            <option>Option three</option>
            <option>Option four</option>
          </select>
        </div>
      </div>

      <div class="ln_solid"></div>
      <div class="form-group">
        <div class="col-md-9 col-sm-9 col-xs-12 col-md-offset-3">
          <button type="button" class="btn btn-primary">Cancel</button>
          <button type="reset" class="btn btn-primary">Reset</button>
          <button type="submit" class="btn btn-success">Submit</button>
        </div>
      </div>

    </form>
  </div>
</div>
{% endblock %}

{% block extra_js %}
  <!-- iCheck -->
  <script src="{% static '/vendors/iCheck/icheck.min.js' %}"></script>
  <!-- Datatables -->
  <script src="{% static '/vendors/datatables.net/js/jquery.dataTables.min.js' %}"></script>
  <script src="{% static '/vendors/datatables.net-bs/js/dataTables.bootstrap.min.js' %}"></script>
  <script src="{% static '/vendors/datatables.net-buttons/js/dataTables.buttons.min.js' %}"></script>
  <script src="{% static '/vendors/datatables.net-buttons-bs/js/buttons.bootstrap.min.js' %}"></script>
  <script src="{% static '/vendors/datatables.net-buttons/js/buttons.flash.min.js' %}"></script>
  <script src="{% static '/vendors/datatables.net-buttons/js/buttons.html5.min.js' %}"></script>
  <script src="{% static '/vendors/datatables.net-buttons/js/buttons.print.min.js' %}"></script>
  <script src="{% static '/vendors/datatables.net-fixedheader/js/dataTables.fixedHeader.min.js' %}"></script>
  <script src="{% static '/vendors/datatables.net-keytable/js/dataTables.keyTable.min.js' %}"></script>
  <script src="{% static '/vendors/datatables.net-responsive/js/dataTables.responsive.min.js' %}"></script>
  <script src="{% static '/vendors/datatables.net-responsive-bs/js/responsive.bootstrap.js' %}"></script>
  <script src="{% static '/vendors/datatables.net-scroller/js/dataTables.scroller.min.js' %}"></script>
  <script src="{% static '/vendors/jszip/dist/jszip.min.js' %}"></script>
  <script src="{% static '/vendors/pdfmake/build/pdfmake.min.js' %}"></script>
  <script src="{% static '/vendors/pdfmake/build/vfs_fonts.js' %}"></script>

{% endblock %}
